<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=0"/>
    <title>乐淘登录</title>
    <link type="image/x-icon" rel="shortcut icon" href="../images/favicon.ico">
    <link rel="stylesheet" href="../assets/mui/css/mui.css"/>
    <link rel="stylesheet" href="../assets/fa/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="../css/common.css"/>
    <link rel="stylesheet" href="../css/user.css"/>
</head>
<body>
<div class="lt_container">
    <header class="lt_topBar">
        <a class="btn_left" href="javascript:history.back();"><span class="mui-icon mui-icon-arrowleft"></span></a>
        <h3>登录</h3>
    </header>
    <div class="lt_content">
        <div class="lt_wrapper">
            <div class="mui-scroll-wrapper">
                <div class="mui-scroll">
                    <form class="mui-input-group">
                        <div class="mui-input-row">
                            <label>用户名</label>
                            <input name="username" type="text" placeholder="请输入用户名">
                        </div>
                        <div class="mui-input-row">
                            <label>密码</label>
                            <input name="password" type="password" class="mui-input-password"  placeholder="请输入密码" >
                        </div>
                        <div class="mui-input-row mui-plus-visible">
                            <label>Input</label>
                            <input type="text" class="mui-input-speech mui-input-clear" placeholder="语音输入" data-input-clear="6" data-input-speech="6"><span class="mui-icon mui-icon-clear mui-hidden"></span><span class="mui-icon mui-icon-speech"></span>
                        </div>
                        <div class="mui-button-row">
                            <button type="button" class="mui-btn mui-btn-primary" id="login">登录</button>&nbsp;&nbsp;
                            <button type="reset" class="mui-btn mui-btn-danger">重置</button>
                        </div>
                    </form>
                    <div class="mui-text-right">
                        <a class="mui-btn mui-btn-link" href="user/register.html">免费注册</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <footer class="lt_tabBar">
        <ul>
            <li><a href="../index.html"><span class="fa fa-home"></span><p>首页</p></a></li>
            <li><a href="../category.html"><span class="fa fa-bars"></span><p>分类</p></a></li>
            <li><a href="cart.html"><span class="fa fa-shopping-cart"></span><p>购物车</p></a></li>
            <li class="now"><a href="index.html"><span class="fa fa-user"></span><p>会员中心</p></a></li>
        </ul>
    </footer>
</div>
<script src="../assets/mui/js/mui.js"></script>
<script src="../assets/zepto/zepto.min.js"></script>
<script>
     /*封装工具函数*/
        window.lt = {};
        /*获取地址栏参数*/
        lt.getUrlParams = function () {
            /*拿到以get形式传递的地址栏的数据 ?key=1&name=10*/
            var search = location.search;
            /*需要把字符串转换成对象  便于开发使用*/
            var params = {};
            /*如果有？代表有参数*/
            /*没有问号就没有参数*/
            if (search.indexOf('?') == 0) {
                search = search.substr(1);
                var arr = search.split('&');
                for (var i = 0; i < arr.length; i++) {
                    /*itemArr name=10  ----> [name,10]*/
                    var itemArr = arr[i].split('=');
                    params[itemArr[0]] = itemArr[1];
                }
            }
            return params;
        }

    $(function(){
        $('#login').on('tap',function(){
            // console.log('登录')
            // console.log($('input[name="username"]').val());
            // console.log($('input[name="password"]').val());
             $.ajax({
                type: 'post',
                url: '/user/login',
                data: { username: $('input[name="username"]').val() , password: $('input[name="password"]').val() },
                datType: 'json',
                success: function (data) {
                    console.log(data);
                    if(data.error === 403){
                        mui.toast('用户名不存在');
                    }
                    if(data.success === true){
                        mui.confirm('MUI是个好框架，确认？', 'Hello MUI', ['确定', '取消'], function (e) {
                            console.log(e);
                            if (e.index == 0) {
                                // console.log('你刚确认MUI是个好框架');
                                if(lt.getUrlParams().returnUrl){
                                    location.href = lt.getUrlParams().returnUrl;
                                }else{
                                    location.href = '/mobile/user/index.html';
                                }
                            } else {
                                console.log('MUI没有得到你的认可，继续加油');
                            }
                        })
                    }
                }
            })
    })});
</script>
</body>
</html>